/* stylelint: ignore unknown at-rules for Tailwind directives */
/* stylelint-disable at-rule-no-unknown */
@tailwind base;
@tailwind components;
@tailwind utilities;
/* stylelint-enable at-rule-no-unknown */
@import "tailwindcss";

/* 全局字体配置：英文使用 Varela Round，中文使用 Noto Sans SC（思源黑体） */
@layer base {
  html {
    font-family: "Varela Round", "Noto Sans SC", sans-serif;
  }
  
  body {
    font-family: "Varela Round", "Noto Sans SC", sans-serif;
  }
}

/* Global basic resets and utility classes can be added here */
html, body, #app {
  height: 100%;
  background-color: #f7fafc;
  font-family: "Varela Round", "Noto Sans SC", sans-serif;
}

/* ensure white background for cards */
.shadow { box-shadow: 0 2px 8px rgba(0,0,0,.05); }

/* 隐藏滚动条但保留滚动功能 */
.no-scrollbar::-webkit-scrollbar {
  display: none; /* Chrome/Safari */
}
.no-scrollbar {
  -ms-overflow-style: none; /* IE/Edge */
  scrollbar-width: none; /* Firefox */
}
/* @media (width >= 48rem) {
  .container {
    width: 100%;
  }
} */

@media (max-width: 63.999999999rem) {
  .container {
    max-width: none !important;
  }
}

/* @media (width >= 40rem) {
  .yoyo-container {
    max-width: 40rem;
    margin-inline: auto;
    padding: 0;
  }
}

@media (width >= 48rem) {
  .yoyo-container {
    max-width: 48rem;
    margin-inline: auto;
    padding: 0;
  }
} */

@media (max-width: 63.999999999rem) {
  .yoyo-container {
    max-width: none !important;
  }
}
@media (width >= 64rem) {
  .yoyo-container {
    max-width: 64rem;
    margin-inline: auto;
  }
}

@media (width >= 80rem) {
  .yoyo-container {
    max-width: 64rem;
    margin-inline: auto;
  }
}

@media (width >= 96rem) {
  .yoyo-container {
    max-width: 72rem;
    margin-inline: auto;
  }
}

/* home */
@media (width >= 64rem) {
  .home-container {
    max-width: 64rem;
    margin-inline: auto;
  }
}

@media (width >= 80rem) {
  .home-container {
    max-width: 80rem;
    margin-inline: auto;
  }
}

@media (width >= 96rem) {
  .home-container {
    max-width: 96rem;
    margin-inline: auto;
  }
}


@media (width >= 120rem) {
  .home-container {
    max-width: 120rem;
    margin-inline: auto;
  }
}